Summary

This is a testing, work in progress PR for the PAC Comparator I was playing with during the 12.x innovation sprint.

• Resolves Build layout of the PAC spending chart #2729
  Doesn't really resolve 2729 but it's closely related

Impacted areas of the application

The committees section / template

Screenshots

Related PRs

None?

How to test

• pull the branch
• npm i
• npm run build
• ./manage.py runserver
• http://127.0.0.1:8000/data/browse-data/?tab=committees
• check nonconnected committees, and the non-nonconnected ones to double-check that the error appears
• check that data and warnings update when the time period is changed
• check numbers
• try to break it

Next steps

Being that this was a proof of concept and scrappy v0, there are still plenty of todos before this is ready for production. Here are some as they pop into my head:

• put behind an env var
• pull the code out of the hard-coded template
• put the css into scss files
• make it responsive
• handle the 'loading' state
• polish look & feel
• decide on visualizations and usability/accessibility
• tell Vue to build for prod, not dev
• triple verify calculations
• there's a ticket for a is_nonconnected var, which would alleviate a chunk of logic in here
• there's another ticket for a nonconnected typeahead option
• remove console logs
• remove unused code (including unused Vue components)
• better documentation
• make Vue components more modular?
• if it's out by then, update to Vue 3?
• more, I'm sure